<extend name="Public/base"/>
		<block name="content">
<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>购物车 查看购物车</title>
		<link href="__ORDER__/css/orderPublic_v1.css" rel="stylesheet" type="text/css">
		<link href="__ORDER__/css/cart_v1.css" rel="stylesheet" type="text/css">	
		<style>
		.msg{background-color:#1C86EE;width:200px;height:30px;position:absolute;left:50%;margin-left:-100px;border-radius:8px;display:none;color:white}
		</style>
	</head>
<body>


<div class="zs-layer-box" id="zs-shop-cart-box" style="display:none;">
	<div class="zs-layer-body">
		<div class="zs-layer-hd"><i class="zs-close"></i></div>
		<div class="zs-layer-content">
			<div class="zs-success">
				<h3>您确定要删除这<span name="tiao"></span>条记录吗?</h3>
			</div>
		</div>
		<div class="zs-layer-foot"> 
			<input name="showcarAllsure" type="button" value="确定" class="zs-settlement-btn">
			<input name="showcarAllcancel" type="button" value="取消" class="zs-settlement-btn">
		</div>
	</div>
</div>

<!--操作提示显示-->
<div class="msg" align="center"></div>
<!-- header -->
	<div class="header clearfix">
		<!--logo样式 -->
		<div class="logo">
			<a href="" title="中关村商城"><img src="__ORDER__/img/shop_212x40.jpg" width="212" height="40"><img src="__ORDER__/img/logo-text.png" width="165" height="40"></a>
		</div>
		<div class="flow-step">       
			<ul class="flow-step-1">
				<li class="s2">下订单</li>
				<li class="s3">去付款</li>
				<li class="s4">确认收货</li>
				<li class="s5">评价</li>
			</ul>
		</div>
	</div>
	<div class="wrapper">                
		<form action="<{:U('Ordsure/ordsure')}>" method="post">
				<input type="hidden" name="buyType" value="2">
				<input type="hidden" name="shu" value="2">
			<div class="cart-state mt">	
				<p>购物车状态<em>（<{$shu}>/30）</em></p>
				<input name="submitCart" type="submit" value="去结算"><span>总计（不含运费）：<em>￥</em><em id="Allprice">0</em></span>
			</div>            
			<div class="order-table mt20">	
				<table width="100%" id="tab">
					<tbody>
					<tr class="d2">
						<th class="th-1">
							<label><input  id="s_all" name="" type="checkbox" >全选</label>
						</th>
						<th class="th-2">所选商品</th>
						<th class="th-3">单价（元）</th>
						<th class="th-4">数量</th>
						<th class="th-5">优惠</th>
						<th class="th-6">小计（元）</th>
						<th class="th-7">操作</th>
					</tr>                                      
					<table class="one-shop">                         
					<tr id="merchant_<{$v.id}>" id="tbb">
						<td colspan="7" class="store-infor clearfix">
							<div class="shopname">
								店铺：<a href="" target="_blank"><{$res.goods_shop}></a>
							</div>
							<div class="contact">
								<a class="tag-security" style="margin: 0 -9px 0 0">&nbsp;</a>
							</div>        
							<div class="contact">                                
								<a target="_blank" href=""><img border="0" src="__ORDER__/pa" alt="点击这里给我发消息" title="点击这里给我发消息"></a>
							</div>
						</td>
					</tr>
					<volist name="res" id="v"> 
					<tr rel="goods-order" class="one-goods" id="showcar_<{$v.id}>">
						<td colspan="2" class="s-infor">  
							<input  class="c1" name="row[]" type="checkbox" value="<{$v.id}>">
							<a href="" class="pic" target="_blank">
								<img width="80" height="60" src="__ROOT__/Uploads/<{$v.pro_img}>" alt="【顺丰包邮】<{$v.goods_desc}>">
							</a>
							<div class="inforbox">
								<h3 class="tit">
									<a href="" title="【顺丰包邮】<{$v.goods_desc}>" target="_blank">【顺丰包邮】<{$v.goods_desc}></a>
								</h3>
								<div class="security clearfix">
									<a href="" title="7天退换货" class="security-a" target="_blank"></a> 
									<a href="" title="上门服务" class="security-c" target="_blank"></a> 
									<a href="" title="真实报价" class="security-d" target="_blank"></a>
									<a href="" title="先行赔付" class="" target="_blank"></a>   
								</div>                    
								<p>颜色：<{$v.goods_color}></p>
								<div class="info-con" id = "<{$v.id}>">
									<span class="taozhuang">套装：<{$v.goods_tc}></span>
									<div class="info-help">
										<h5><{$v.goods_tc}>：</h5>
										<p>【<{$v.goods_tc_desc}>】</p>			
									</div>						
								</div>                                              
							</div>
						</td>
						<td class="s-price">                 
							<span class="price"><{$v.goods_price}></span>  
						</td>
						<td class="s-amount">
							<div class="buy-num">                       
								<input type="button" class="minus"  value="-" title="减一">
								<input type="text" class="text-amount" name="amount[<{$v.id}>]" value="<{$v.goods_num}>" data-id="<{$v.id}>">
								<input type="button" class="plus"  value="+" title="加一"> 
								<div class="tips-2"  id="tishi-<{$v.id}>" style="display:none;">请输入大于0且小于等于<{$v.goods_pnum}>的正整数!</div>
								<input type="hidden" id="kcun_<{$v.id}>" value="<{$v.goods_pnum}>">
								<div class="tips-2"  id="kucun-<{$v.id}>" style="display:none;" >最多只能购买<{$v.goods_pnum}>件!</div>
							</div>
						</td>
						<td class="s-agio">
							<div>&#8722;&#8722;</div>         
						</td>
						<td class="s-total">
							<em  class="oneprice">
								<{$v['goods_price'] * $v['goods_num']}>
							</em>
						</td>
						<td class="s-del">
							<div class="s-delbox"> 
								<a class="private" title="移入收藏夹" data-id="<{$v.id}>">移入收藏夹</a>
								<a class="del" data-id="<{$v.id}>">删除</a>
								<div class="deletebox" style="display:none;" id="zp-cart-<{$v.id}>">
									<p>确认要删除该商品吗？</p>
									<a class="deleSure" data-id="<{$v.id}>">是的</a><a class="cancel" data-id="<{$v.id}>">取消</a><i></i>
								</div>                                                
							</div>
						</td>
					</tr>
					</volist>
					</table>
				</tbody>
				</table>	 
				<div class="total-price">
					商品总价<span>（不含运费）</span>：
					<em>￥</em>
					<label id="Alltotal">0</label>
				</div>		
				<div class="order-foot clearfix">
					<label>
						<input name="checkAllCart" type="checkbox"  id="s_all">全选
					</label>					
					<a class="deleall">批量删除</a> 					
					<a href="" class="go-shopping">&lt;&lt;继续购物</a>
					<div class="deletebox" style="display:none;" id="deleallbox">
						<p>确认要删除这些商品吗？</p>
						<a class="deleallSure2">是的</a><a class="cancel2">取消</a><i></i>
					</div>				
					<input type="submit" value="去结算" name="submitCart" class="accounting-btn">				
				</div>
				 
			</div>    
		</form>    
	</div>
	<!--下面猜你喜欢-->
	<div class="wrapper" id="zp-goods-recommend">
		<div class="modgoods mt20">
			<ul class="modgoods-tab clearfix">
				<li class="cur">猜你喜欢</li>
			</ul>
			<div class="modgoods-tabbox">
				<ul class="modgoods-list clearfix" style="display:block;">
					<li>
						<a class="pic" href="" title="【快递包邮】联想 S810t    主屏尺寸：5.5英寸  800万像素   四核  1280x720像素" target="_blank">
							<img width="160" height="120" src="__ORDER__/img/ChMkJ1cLOxeIPzHyAAHkZymrMZgAAPsKwGOGioAAeR_895.jpg" alt="【快递包邮】联想 S810t    主屏尺寸：5.5英寸  800万像素   四核  1280x720像素">
							<span>【快递包邮】联想 S810t    主屏尺寸：5.5英寸  800万像素   四核  1280x720像素</span>
						</a>
						<div class="price">￥465.00</div>
					</li>
				</ul>
			</div>
		</div>
	</div>
	<script type="text/javascript">
	//////////// 关闭按钮/////////////
	$(".zs-close").click(function(){
            $('.zs-layer-box').hide();
    });

	//////////// 套装显示//////////////////
	$(".info-con").mouseover(function(){
	$(this).addClass("info-con-hover");
	}).mouseleave(function(){
	$(this).removeClass("info-con-hover");
	});         

	//////////购物车计算总价//////////////

	///////////////全选 /////////////// 
	$(function(){	
		$('#s_all').click(function(){
			if($(this).is(":checked")){
				$('.c1').prop('checked',$(this).prop('checked'));
				TotalPrice();
			}else {
			   $('.c1').prop('checked',$(this).prop('checked'));
			   $("#Allprice").css("color","red").text(0);
			   $("#Alltotal").css("color","red").text(0);
		    }
		});		
	});


	// /////////////选择商品按钮/////////////////

	$(".c1").click(function() {
    var goods = $(this).closest(".one-shop").find(".c1"); //获取所有商品
    var goodsC = $(this).closest(".one-shop").find(".c1:checked"); //获取所有被选中的商品
    var Shops = $(this).closest(".one-shop").find("#s_all"); //获取全选按钮
    if (goods.length == goodsC.length) { //如果选中的商品等于所有商品
      Shops.prop('checked', true); //全选按钮被选中
      if ($("#s_all").length == $("#s_all:checked").length) { //如果被选中的数量等于所有数量
        $("#s_all").prop('checked', true); //全选按钮被选中
        TotalPrice();
      } else {
        $("#s_all").prop('checked', false); //else全选按钮不被选中 
        TotalPrice();
      }
    } else { //如果选中的商品不等于所有商品
      Shops.prop('checked', false); //全选按钮不被选中
      TotalPrice();
    }
  });
			
 
  ///////////////数量减按钮///////////////////
	$(".minus").click(function() {
		 $(".tips-2").hide();
		//var id = $(this).parent().find('.text-amount').attr("data-id");	
		//var num = $("#kcun"+id).val();
		var t = $(this).parent().find('.text-amount');
		t.val(parseInt(t.val()) - 1);
		if (t.val() <= 1) {
		  t.val(1);
		}
		TotalPrice();
  });
  //////////// 数量加按钮/////////////////
  $(".plus").click(function() {
	var id = $(this).parent().find('.text-amount').attr("data-id");	
	console.log(id);
	var num = parseInt($("#kcun_"+id).val());
	console.log(num);
    var t = $(this).parent().find('.text-amount');
    parseInt(t.val(parseInt(t.val()) + 1));
    if (t.val()<= 1) {
      t.val()=1;
    }
	var m =t.val();
	console.log(m);
	if((t.val()) > num) {
		t.val(num);
		$("#kucun-"+id).show();
	}

    TotalPrice();
  });

  /////////////输入框直接输入/////////////
  $('.text-amount').change(function(){
	  var id = $(this).attr("data-id"); 
	  var num = parseInt($("#kcun_"+id).val());
	  var m = parseInt($(this).val());
	  console.log(id);
	  if(($(this).val())<= num){
		TotalPrice();
		$("#tishi-"+id).hide();
		$("#kucun-"+id).hide();
	 }else{
		 if(!isNaN(m)){
			 $('.text-amount').val(num);		
			 $("#kucun-"+id).show();
			 $("#tishi-"+id).hide();
			 TotalPrice();
		 }else{
			 $("#tishi-"+id).show();
		 }
	 }

  });

	///////////////总价////////////////
  function TotalPrice() {
    var oprice = 0; /////总价 默认为不选中为0
      $(".one-shop").find(".c1").each(function() { //循环店商品
        if ($(this).is(":checked")) { ///////如果该商品被选中的情况
			var num = parseInt($(this).parents(".one-goods").find(".text-amount").val()); //商品的数量
			var price = parseFloat($(this).parents(".one-goods").find(".price").text()); //商品的单价
			var total = price * num; //计算单个商品的总价
			$(this).parents(".one-goods").find(".oneprice").css("color","red").text(total.toFixed(2));
			var oneprice = parseFloat($(this).parents(".one-goods").find(".oneprice").text());
			oprice +=oneprice;
			$("#Alltotal").css("color","red").text(oprice.toFixed(2)); //输出全部总价(上方)
			$("#Allprice").css("color","red").text(oprice.toFixed(2)); //输出全部总价(下方)		  
		}else{/////全部不选中的情况////////////
			var num = parseInt($(this).parents(".one-goods").find(".text-amount").val()); 
			var price = parseFloat($(this).parents(".one-goods").find(".price").text());
			var total = price * num; ///////不选中时仍可计算单个商品的总价///////
			$(this).parents(".one-goods").find(".oneprice").css("color","red").text(total.toFixed(2));
			$("#Alltotal").css("color","red").text(oprice.toFixed(2)); //输出全部总价为0
			$("#Allprice").css("color","red").text(oprice.toFixed(2)); //输出全部总价为0
		}
	 });	  
  }

	/////////////// 删除购物//////////////
	$(".del").click(function(){
		var id = $(this).attr("data-id");
		$("#zp-cart-"+id).show();
	});

	$(".cancel").click(function(){
		var id = $(this).attr("data-id");
		$("#zp-cart-"+id).hide();
	});

	///////////确认删除//////////////
	$(".deleSure").click(function(){
		var id = $(this).attr('data-id');
		$.get('<{:U("showcarDel")}>',{id:id},function(data){
		if(data.status){				
			$('#showcar_'+id).remove();
			$('.msg').text(data.msg);
			$('.msg').slideDown('fast');
			setTimeout(function(){$('.msg').slideUp('fast');},1600);
		 }
		},'json');	
		$("#zp-cart-"+id).hide();
	});


    /////////////////批量删除///////////////////////
		$('.deleall').click(function(){		
			var arr = [];      
		$('input:checked').each(function(){   //所有为checked状态的多选框   
			arr.push(this.value);  
		});  
		if(arr.length == 0 ){ 
			alert("请选择需要删除的记录");  
			return;  
		}  
			
		var len = $("input[name='row[]']:checked").length;
		$(".zs-success span[name='tiao']").text(len);
		$(".zs-layer-box").show();
		$(".zs-layer-foot input[name='showcarAllcancel']").click(function(){
		$(".zs-layer-box").hide();
		});
		
		$(".zs-layer-foot input[name='showcarAllsure']").click(function(){
		$.post('<{:U("showcarDelall")}>',{arr:arr},function(data){
		if(data.status){				
			$("input[name='row[]']:checked").each(function() {              
				$(this).parent().parent().remove(); 
			});
			$('.msg').text(data.msg);
			$('.msg').slideDown('fast');
			setTimeout(function(){$('.msg').slideUp('fast');},1600);
		  }
		},'json');
		$(".zs-layer-box").hide();
		});				
	});
	</script>
</body>
</html>
</block>